/**
 * @Date 2023-02-21 10:03:49
 * @Remark
 */

// react
import React from "react";
// lib
import { Space, Button, Popconfirm, Switch } from "antd";

import { state } from "./state";
import { addBorrowController, addOrderController } from "./controller";

const TableColumns = [
  {
    title: "图书ID",
    dataIndex: "bookId",
  },
  {
    title: "图书名称",
    dataIndex: "title",
  },
  {
    title: "作者",
    dataIndex: "author",
  },
  {
    title: "出版社",
    dataIndex: "publisher",
  },
  {
    title: "出版日期",
    dataIndex: "publishDate",
  },
  {
    title: "所属分类",
    dataIndex: "categoryId",
    render: (el: number) => {
      return state.getCategoryList().find(item => item.categoryId === el)?.categoryName
    }
  },
  {
    title: "ISBN",
    dataIndex: "isbn",
  },
  {
    title: "定价",
    dataIndex: "price",
  },

  {
    title: "操作",
    key: "action",
    fixed: "right" as any,
    render: (el: BookDto) => {
      const borrow = () => {
        addBorrowController({bookId: el.bookId })
      };
      const order = () => {
        addOrderController({bookId: el.bookId })
      };
      const detail = () => {
        state.editModal = el;
      };

      return (
        <Space>
          <Button size="small" type="primary" ghost onClick={detail}>
            详情
          </Button>
          <Popconfirm
            title={`确定借阅《${el.title}》吗?`}
            onConfirm={borrow}
          >
            <Button
              size="small"
              type="primary"
              disabled={el.availableCount === 0}
            >
              借阅
            </Button>
          </Popconfirm>
          <Popconfirm
            title={`确定预约《${el.title}》吗?`}
            onConfirm={order}
          >
            <Button size="small" danger ghost disabled={el.availableCount ? el.availableCount > 0 : false}>
              预约
            </Button>
          </Popconfirm>
        </Space>
      );
    },
  },
];

export default TableColumns;
